<template>
  <layout title="客户信息" :showBack="true" :showTabBar="false">
    <x-icon slot="icon" @click="onSave" type="checkmark" style="fill:#fff;position:relative;top:-4px;right:3px;"></x-icon>

    <group title="客户信息">
      <x-input title="客户姓名" v-model="form.name"></x-input>
      <popup-radio title="客户来源" v-model="form.source" :options="customer_source"></popup-radio>
      <popup-radio title="客户类型" v-model="form.type" :options="customer_category"></popup-radio>
      <popup-radio title="客户性质" v-model="form.category" :options="customer_type"></popup-radio>
      <popup-radio title="初步结果" v-model="form.result" :options="start_result"></popup-radio>
      <popup-radio title="合作方式" v-model="form.cooperation" :options="cooperation"></popup-radio>
      <x-input title="详细地址" v-model="form.address"></x-input>
      <x-textarea title="备注" v-model="form.remark"></x-textarea>

    </group>
  </layout>
</template>

<script>
  import { Group, Cell, XInput, Selector, PopupRadio, XTextarea } from 'vux'
  import Layout from './Layout.vue'
  import { mapGetters } from 'vuex'
  import { customer as api } from '../api'

  export default {
    components: {
      Group,
      Cell,
      Layout,
      XInput,
      Selector,
      PopupRadio,
      XTextarea,
    },
    data() {
      return {
        form: {
          id: undefined,
          name: null,
          source: null,
          type: null,
          category: null,
          result: null,
          cooperation: null,
          address: null,
          remark: null
        },
      }
    },
    methods: {
      async onSave() {
        let ret = await api.save(this.form)
        if (!ret.success) {
          this.$vux.toast.show('保存失败！')
          return
        }
        let that = this
        this.$vux.toast.show({
          text: '保存成功',
          onHide() {
            that.$router.go(-1)
          }
        })
      }
    },
    computed: {
      ...mapGetters(['customer_source', 'cooperation', 'customer_type', 'start_result', 'customer_category'])
    },
    async mounted() {
      this.$store.commit('showBack', true)
      let id = this.$route.query.id
      if (id) {
        let ret = await api.detail({ id })
        if (!ret.success) {
          this.$vue.toast.show('数据读取失败！')
          return
        }
        this.form = ret.data
      }
    }
  }

</script>
